<template>
    <div class="box contact">
        <div class="imgBox">
            <img src="../../assets/img/gywmban.jpg" alt="">
        </div>
        <van-tabs @click="tabOnClick" v-model="active">
            <van-tab title="黑马概况" style=" line-height: 24px;padding:10px;text-indent: 1em;" class="lh"></van-tab>
            <van-tab title="品牌理念" ></van-tab>
        </van-tabs>
        <van-divider style="border-color: rgb(25, 137, 250); color: rgb(25, 137, 250); padding: 0px 16px;">
            联系电话
        </van-divider>
        <div class="tellphone" style="margin-left:15px;">
            <span>电话：</span>
            <a href="tel:400-618-9090">400-618-9090</a>
        </div>
        <van-divider style="border-color: rgb(25, 137, 250); color: rgb(25, 137, 250); padding: 0px 16px;">
            校区位置
        </van-divider>
        <!--百度地图容器-->
        <!--百度地图容器-->
      <iframe src="http://localhost:8080/location.html "   width="100%" height="400" frameborder="0" scrolling="no"></iframe>
    </div>
</template>

<script>

export default {
    data () {
        return {
            active:0,
        };
    },
    methods:{
        async tabOnClick(name,title ){
            var tabs =  document.querySelectorAll('.van-tab__pane')
            const {data:res} = await this.$axios.get('http://localhost:8080/heima.json ')
            if(name == 1){
                tabs[1].innerHTML = res.idea
            }else{
                tabs[0].innerHTML= res.introduce;
            }
        },
    },  
    created (){
       
    },
    mounted (){
        this.tabOnClick();
    },
}
</script>
<style scoped lang="less">
.imgBox{
    img{
        width: 100%;
    }
}
</style>